<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css"/>
<meta http-equiv="Content-Type" content="text/html; charset=US-ASCII"/>
<title th:utext="#{message.resetPassword}">reset</title>
</head>
<body>
<div class="container">
    <h1 th:utext="#{message.resetPassword}">reset</h1>
    <br/>
    <div class="row">
      <form action="#">
        <label class="col-sm-1" th:utext="#{label.user.email}">email</label>
        <span class="col-sm-5"><input class="form-control" id="email" name="email" type="email" value="" required="required" /></span>
        <button class="btn btn-primary" type="submit" th:utext="#{message.resetPassword}">reset</button>
      </form>
    </div>

<br/> 
<a class="btn btn-default" th:href="@{/registration.html}" th:utext="#{label.form.loginSignUp}">registration</a>
<br/><br/>
<a class="btn btn-default" th:href="@{/login}" th:utext="#{label.form.loginLink}">login</a>

</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script th:inline="javascript">
var serverContext = [[@{/}]];

$(document).ready(function () {
	$('form').submit(function(event) {
		resetPass(event);
    });
});

function resetPass(event){
    event.preventDefault();	
    var email = $("#email").val();
    $.post(serverContext + "user/resetPassword",{email: email} ,function(data){
            window.location.href = serverContext + "login?message=" + data.message;
    })
    .fail(function(data) {
    	if(data.responseJSON.error.indexOf("MailError") > -1)
        {
            window.location.href = serverContext + "emailError.html";
        }
        else{
            window.location.href = serverContext + "login?message=" + data.responseJSON.message;
        }
    });
}

$(document).ajaxStart(function() {
    $("title").html("LOADING ...");
});
</script>
</body>

</html>